<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>循环</title>
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css">
    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
</head>
<body>
    <pre class="language-javascript">
       <code> for(var i = 10; i>4;i-=2){
            if (i < 7) {
                i++
            }else {
                i--
            }
        }
        console.log(i); // 4

        // 循环体中的关键词
        // continue：结束当前这轮循环（coutinue之后的代码不再执行 继续下一轮循环）

        // break：强制结束整个循环（break之后的代码也不再执行 而且整个循环直接结束）

        // for(var a = 0;a < 10;a++) {
        //     continue
        // }
        // console.log(a); // 10

        for(var a = 0;a < 10;a++) {
            if (a >= 2){
                a+=2
                continue
            }
            if(a>=6) {
                a--
                break
            }
            a++
            console.log(a); // 1
        }
        console.log(a); // 11

        // for循环正确执行顺序    
        /**
         * 
         * 初始值 ==> 判断是否符合当前判断 ==> 执行符合条件的代码块里面的内容 ==> 然后开始执行 xx++(也就是步长计数操作) 再次判断
         * 
         * 下列执行步骤
         * 1、xx = 0 ==> 判断符合条件 ==> 执行内部代码逻辑 ==> xx++ = 1 ==> 输出 1 
         * 2、开始执行累加器 xx++ = 2 ==> 判断符合条件 ==> 执行代码逻辑 ==> xx+=2 = 4 ==> 跳过本次循环 ==> xx++ = 5  ========> 直到最后计数器加上之后在判断 < 10 不成立之后跳出循环 ====> 此时xx = 11
         * 
        */
        for(var xx = 0 ; xx < 10; xx++ ){
            if(xx >= 2){
                xx += 2
                continue
            }
            if(xx >= 6) {
                xx--
                break
            }
            xx++
            console.log(xx);
        }
        console.log(xx);

        for(var od = 0;od< 10;od+=10) {
            od += 10
            console.log('od',od); // 10
        }
        console.log('od',od); // 20

        for(var xd = 0;xd< 10;xd++) {
            xd += 10
            console.log('xd',xd);
        }
    </code>
    </pre>
    

<script>
  hljs.highlightAll();
</script>
    <script>
        for(var i = 10; i>4;i-=2){
            if (i < 7) {
                i++
            }else {
                i--
            }
        }
        console.log(i); // 4

        // 循环体中的关键词
        // continue：结束当前这轮循环（coutinue之后的代码不再执行 继续下一轮循环）

        // break：强制结束整个循环（break之后的代码也不再执行 而且整个循环直接结束）

        // for(var a = 0;a < 10;a++) {
        //     continue
        // }
        // console.log(a); // 10

        for(var a = 0;a < 10;a++) {
            if (a >= 2){
                a+=2
                continue
            }
            if(a>=6) {
                a--
                break
            }
            a++
            console.log(a); // 1
        }
        console.log(a); // 11

        // for循环正确执行顺序    
        /**
         * 
         * 初始值 ==> 判断是否符合当前判断 ==> 执行符合条件的代码块里面的内容 ==> 然后开始执行 xx++(也就是步长计数操作) 再次判断
         * 
         * 下列执行步骤
         * 1、xx = 0 ==> 判断符合条件 ==> 执行内部代码逻辑 ==> xx++ = 1 ==> 输出 1 
         * 2、开始执行累加器 xx++ = 2 ==> 判断符合条件 ==> 执行代码逻辑 ==> xx+=2 = 4 ==> 跳过本次循环 ==> xx++ = 5  ========> 直到最后计数器加上之后在判断 < 10 不成立之后跳出循环 ====> 此时xx = 11
         * 
        */
        for(var xx = 0 ; xx < 10; xx++ ){
            if(xx >= 2){
                xx += 2
                continue
            }
            if(xx >= 6) {
                xx--
                break
            }
            xx++
            console.log(xx);
        }
        console.log(xx);

        for(var od = 0;od< 10;od+=10) {
            od += 10
            console.log('od',od); // 10
        }
        console.log('od',od); // 20

        for(var xd = 0;xd< 10;xd++) {
            xd += 10
            console.log('xd',xd);
        }
    </script>
</body>
</html>